.webuploader-pick {
    position: relative;
    display: inline-block;
    cursor: pointer;
    background: #00b7ee;
    padding: 10px 15px;
    color: #fff;
    text-align: center;
    border-radius: 3px;
    overflow: hidden;
}
.webuploader-pick-hover {
    background: #00a2d4;
}

.webuploader-dnd {
    width: 400px;
    height: 400px;
    border: 3px solid #ddd;
}

.webuploader-dnd-over {
    border-style: dashed;
}

.web-uploader-wrap {
    border: 1px solid #dadada;
    color: #838383;
    font-size: 12px;
    background-color: #FFF;
}

.web-uploader .queueList {
    margin: 10px;
}

.element-invisible {
    display:none;
}

.web-uploader .placeholder {
    padding: 45px 0;
    text-align: center;
    color: #cccccc;
    font-size: 18px;
    position: relative;
}

.web-uploader .placeholder .webuploader-pick {
    font-size: 18px;
    background: #00b7ee;
    border-radius: 3px;
    line-height: 44px;
    padding: 0 30px;
    color: #fff;
    display: inline-block;
    cursor: pointer;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

.web-uploader .placeholder .webuploader-pick-hover {
    background: #00a2d4;
}

.web-uploader .placeholder .flashTip {
    color: #666666;
    font-size: 12px;
    position: absolute;
    width: 100%;
    text-align: center;
    bottom: 20px;
}
.web-uploader .placeholder .flashTip a {
    color: #0785d1;
    text-decoration: none;
}
.web-uploader .placeholder .flashTip a:hover {
    text-decoration: underline;
}

.web-uploader .placeholder.webuploader-dnd-over {
    border-color: #999999;
}

.web-uploader .filelist {
	display:none;
	height: 130px;
	overflow-y:auto;
    list-style: none;
    margin: 0;
    padding: 10px;
}

.web-uploader .filelist:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    overflow: hidden;
    clear: both;
}

.web-uploader .filelist li {
	position: relative;
    width: 100%;
    margin: 0;
    font-size: 14px;
}
.web-uploader .filelist li p{margin:0;}
.web-uploader .filelist li p.item{height:32px;line-height:32px;}
.web-uploader .filelist li span {display:inline-block;}
.web-uploader .filelist li span.title, .web-uploader .filelist li span.message {
    white-space: nowrap;
    text-overflow : ellipsis;
}
.web-uploader .filelist li span.message {margin:0 15px;}

.web-uploader .filelist li p.imgWrap {
	/*display:none;
    position: absolute;
	top:0px;
	right:90px;
    z-index: 2;*/
	width:90px;
	height: 90px;
    line-height: 90px;
    vertical-align: middle;
    overflow: hidden;

    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;

    -webit-transition: 200ms ease-out;
    -moz-transition: 200ms ease-out;
    -o-transition: 200ms ease-out;
    -ms-transition: 200ms ease-out;
    transition: 200ms ease-out;
}
.web-uploader .filelist li p.imgWrap img{width:100%;}

.web-uploader .filelist span.cancel,.web-uploader .filelist span.rotateRight,.web-uploader .filelist span.rotateLeft,.web-uploader .filelist span.preview {
    width: 16px;
    height: 17px;
	overflow:hidden;
    float: right;
    text-indent: -9999px;
    background: url(icons.png) no-repeat;
	margin:7px 0 0 5px;
    cursor: pointer;
}

.web-uploader .filelist span.rotateLeft {
    background-position: 0 -24px;
}
.web-uploader .filelist span.rotateLeft:hover {
    background-position: 0 0;
}

.web-uploader .filelist span.rotateRight {
    background-position: -24px -24px;
}
.web-uploader .filelist span.rotateRight:hover {
    background-position: -24px 0;
}

.web-uploader .filelist span.cancel {
	width:17px;
    background-position: -48px -24px;
}
.web-uploader .filelist span.cancel:hover {
    background-position: -48px 0;
}
.web-uploader .filelist span.preview {
	display:none;
	width:22px;
	height:16px;
	background-position: -68px 0;
}
.web-uploader .filelist span.preview:hover {
	background-position: -68px -24px;
}

.web-uploader .filelist span.size {
	float:right;
	margin-right:15px;
}

.web-uploader .filelist li p.progress {
    width: 100%;
    bottom: 0;
    left: 0;
    height: 8px;
    overflow: hidden;
    z-index: 50;
}
.web-uploader .filelist li p.progress span {
    display: none;
    overflow: hidden;
    width: 0;
    height: 100%;
    background: #1483d8 url(progress.png) repeat-x;

    -webit-transition: width 200ms linear;
    -moz-transition: width 200ms linear;
    -o-transition: width 200ms linear;
    -ms-transition: width 200ms linear;
    transition: width 200ms linear;

    -webkit-animation: progressmove 2s linear infinite;
    -moz-animation: progressmove 2s linear infinite;
    -o-animation: progressmove 2s linear infinite;
    -ms-animation: progressmove 2s linear infinite;
    animation: progressmove 2s linear infinite;

    -webkit-transform: translateZ(0);
}

@-webkit-keyframes progressmove {
    0% {
       background-position: 0 0;
    }
    100% {
       background-position: 17px 0;
    }
}
@-moz-keyframes progressmove {
    0% {
       background-position: 0 0;
    }
    100% {
       background-position: 17px 0;
    }
}
@keyframes progressmove {
    0% {
       background-position: 0 0;
    }
    100% {
       background-position: 17px 0;
    }
}

.web-uploader .statusBar {
    height: 63px;
    border-top: 1px solid #dadada;
    padding: 0 20px;
    line-height: 63px;
    vertical-align: middle;
    position: relative;
}

.web-uploader .statusBar .progress {
    border: 1px solid #1483d8;
    width: 198px;
    background: #fff;
    height: 18px;
    position: relative;
    display: inline-block;
    text-align: center;
    line-height: 20px;
    color: #6dbfff;
    position: relative;
    margin-right: 10px;
}
.web-uploader .statusBar .progress span.percentage {
    width: 0;
    height: 100%;
    left: 0;
    top: 0;
    background: #1483d8;
    position: absolute;
}
.web-uploader .statusBar .progress span.text {
    position: relative;
    z-index: 10;
}

.web-uploader .statusBar .info {
    display: inline-block;
    font-size: 14px;
    color: #666666;
}

.web-uploader .statusBar .btns {
    position: absolute;
    top: 10px;
    right: 20px;
    line-height: 40px;
}

.web-uploader .statusBar .btns .webuploader-pick,
.web-uploader .statusBar .btns .uploadBtn,
.web-uploader .statusBar .btns .uploadBtn.state-uploading,
.web-uploader .statusBar .btns .uploadBtn.state-paused {
    background: #ffffff;
    border: 1px solid #cfcfcf;
    color: #565656;
    padding: 0 18px;
    display: inline-block;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
    float: left;
}
.web-uploader .statusBar .btns .uploadBtn {
	margin-left:10px;
}
.web-uploader .statusBar .btns .webuploader-pick-hover,
.web-uploader .statusBar .btns .uploadBtn:hover,
.web-uploader .statusBar .btns .uploadBtn.state-uploading:hover,
.web-uploader .statusBar .btns .uploadBtn.state-paused:hover {
    background: #f0f0f0;
}

.web-uploader .statusBar .btns .uploadBtn {
    background: #00b7ee;
    color: #fff;
    border-color: transparent;
}
.web-uploader .statusBar .btns .uploadBtn:hover {
    background: #00a2d4;
}

.web-uploader .statusBar .btns .uploadBtn.disabled {
    pointer-events: none;
    opacity: 0.6;
}

.web-uploader .addButton {
    display: inline-block;
    float: left;
}

.web-uploader .webuploader-container {position:relative !important;display:inline-block;}
.web-uploader .placeholder .webuploader-container {margin:20px 0;}
.web-uploader .webuploader-container .webuploader-pick {margin:0px;}
.web-uploader .webuploader-container div+div , .web-uploader .webuploader-container .webuploader-element-invisible {position:absolute;left:0px !important;top:0px !important;width:100% !important;height:100% !important;}
.web-uploader .webuploader-container .webuploader-element-invisible {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); -moz-opacity:0; -webkit-opacity:0;  opacity:0;cursor:pointer;text-indent:-1000px;}
.web-uploader .webuploader-container label {display:none !important;}
